<template>
  <!-- 经销商配件采购额及返利查询 -->
  <div>
    <TopFilter :list="dealerTopFilterList" :cols="3" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <FilterTable
      ref="table"
      columnsRef="waxDealerFormA"
      :columns="columns"
      :datakey="'records'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onEnterEvent="doubleClick"
      :isSelectColumn="false"
      :dataSource="dataSource"
      :isMemoryPagination="true"
    >
      <!-- :fetchapi="fetchApi"
    :params="fetchParams" -->
      <template slot="controls" slot-scope="props">
        <!-- <el-button size="small" type="primary" icon="el-icon-daochu" :disabled="exportBtn" @click="handleExport">导出</el-button>
        <el-button size="small" type="primary" icon="el-icon-printer" :disabled="printBtn" @click="handlePrint">打印</el-button> -->
        <!-- <el-button size="small" type="primary" icon="el-icon-plus" @click="publishInfo">新建</el-button>
        <AjaxButton :click="pushDialog" type="primary">发布</AjaxButton>
        <AjaxButton :click="offlineDialog" type="primary">下线</AjaxButton> -->
      </template>
    </FilterTable>
    <BaseDialog :visible.sync="visible" :title="dialogTitle" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <DealerDoubleClick :PERIOD="PERIOD" @close="closeHandler" />
    </BaseDialog>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { getDealerRelatedList, getDealerCashList } from '@/api/part/report/dealerRelatedInquiry';
import { convertString } from './util';
import DealerDoubleClick from './doubleDialog';
import moment from 'moment';
export default {
  name: 'DealerQuery',
  components: { DealerDoubleClick },
  mixins: [dictionary],
  props: [],
  data() {
    return {
      dealerTopFilterList: this.createAttachmentTopFilterList(),
      columns: this.createTableList(),
      fetchParams: { xhrAbort: true },
      exportBtn: false,
      printBtn: false,
      fetchApi: getDealerRelatedList,
      visible: false,
      dialogTitle: '明细',
      PERIOD: '',
      dataSource: []
    };
  },
  methods: {
    // 双击事件
    doubleClick(val) {
      console.log('双击事件', val);
      this.PERIOD = val.SPBUP;
      this.visible = true;
    },
    // 打印处理
    handlePrint() {},
    // 导出处理
    handleExport() {},
    // 展开收起调用函数
    collapseHandle() {},
    // 搜索条件改变调用方法
    async changeHandle(val) {
      let arr = convertString(val.I_PERIOD1);
      val.I_PERIOD1 = convertString(val.I_PERIOD1);
      val.I_PERIOD2 = convertString(val.I_PERIOD2);
      console.log(val, '查询条件');
      // this.fetchParams = Object.assign({ xhrAbort: false }, { ImportParameter: val });
      // this.columns = [...this.columns];
      let res = await getDealerRelatedList(Object.assign({}, { ImportParameter: val }));
      this.dataSource = [];
      this.dataSource = res.data;
    },
    // 创建表单字段列表
    createTableList() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '经销商代码',
          dataIndex: 'KUNNR',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '经销商名称',
          dataIndex: 'NAME1',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '选项',
          dataIndex: 'NAME',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '数值',
          dataIndex: 'VALUE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '年月',
          dataIndex: 'SPBUP',
          dateFormat: '',
          sorter: true,
          filter: true,
          filterType: 'date-range',
          filterItems: []
        }
      ];
    },
    // 创建筛选条件
    createAttachmentTopFilterList() {
      return [
        {
          type: 'RANGE_DATE',
          label: '财政期间',
          fieldName: 'I_PERIOD1|I_PERIOD2',
          initialValue: [
            moment()
              .startOf('month')
              .format('YYYY-MM-DD'),
            moment().format('YYYY-MM-DD')
          ],
          placeholder: '',
          rules: [{ required: true, message: '请选择财政期间', trigger: 'blur' }]
        }
      ];
    },
    // 关闭操作
    closeHandler() {
      this.visible = false;
    }
  }
};
</script>

<style></style>
